﻿@using Telerik.Web.Mvc
@using Telerik.Web.Mvc.UI
@using Presentation.Web.Admin
<link href="@Url.Content("~/Content/colorbox.css")" rel="stylesheet" type="text/css" />
<script src="@Url.Content("~/Scripts/jquery.colorbox.js")" type="text/javascript"></script>
@model  IEnumerable<Domain.Dto.ArticleInfoDto>
@{
    ViewBag.subtitle = "特惠活动管理";
    ViewBag.title = "特惠活动管理";
    Layout = "~/Views/Shared/_Layout.cshtml";
}
@{ Html.Telerik().Window()
        .Name("ArticleAddWindow")
        .Title("添加活动")
        .Content(@<text>
    @Html.Partial("_Add", new Domain.Dto.ArticleInfoDto())
    </text>)
        .Width(700)
        .Draggable(true).Modal(true).Visible(false)
        .Render();
}
@{ Html.Telerik().Window()
        .Name("ArticleAddPicWindow")
        .Title("添加配图")
        .Content(@<text>
    @Html.Partial("_ArticlePicUpload")
    </text>)
        .Width(500)
        .Draggable(true).Modal(true).Visible(false)
        .Render();
}
@{ Html.Telerik().Window()
        .Name("ArticlePicPreViewWindow")
        .Title("浏览图片")
        .Content(@<text>
    <div id="divArticlePicPreView">
        &nbsp;
        <div style="display: none;">
            i am sum
        </div>
    </div>
    </text>)
        .Draggable(true).Modal(true).Visible(false)
        .Render();
}
@{Html.Telerik().Grid(Model)
    .Name("ArticleGrid")
    .ToolBar(toolBar => toolBar.Template(
    @<text>
    @{
        if (Html.HasUiPermission(this.ViewContext, "Search"))
        {
        <label class="customer-label" for="Customers-input">
            标题:
        </label>
        <input type="text" id="searchArticle" value="标题" data-autocomplete="/article/search" />
        <input type='button' value='我要搜索' class='t-button' onclick='searchChange()' />
        }
        if (Html.HasUiPermission(this.ViewContext, "add"))
        { 
        <a href="javascript:;" id="addArticle" class='t-button'>添加活动</a>
        }
        if (Html.HasUiPermission(this.ViewContext, "muldelete"))
        { 
        <a href='javascript:;' class='t-button' onclick='mulDelete()'>删除选择项</a>
        }
    }
    </text>))
    .Columns(columns =>
    {
        columns.Template(@<text><input name="selectRow" type="checkbox" value="@item.Id " title="checkedRecords" /></text>)
        .HeaderTemplate(@<text><input type="checkbox" title="选择所有" id="checkAllRecords" /></text>)
        .Width(50).HeaderHtmlAttributes(new { style = "text-align:center" }).HtmlAttributes(new { style = "text-align:center" })
        .ClientTemplate("<input type=\"checkbox\" title=\"check all records\" name = 'selectRow' value = '<#= Id #>'/>");
        columns.Bound(o => o.Id).Width(200).Title("系统Id").Hidden();

        columns.Template(@<text><a href = '/article/edit/@(item.Id)'>@(item.Title)</a></text>)
        .ClientTemplate("<a  href = '/article/edit/<#=Id #>'><#=Title #></a> ")
        .Width(200).Title("标题");

        columns.Bound(o => o.SubTitle).Width(150).Title("副标题");
        columns.Bound(o => o.Remark).Width(300).Title("简介");

        columns.Bound(o => o.Content).Width(200).Title("内容").Hidden();
        columns.Bound(o => o.Source).Width(200).Title("来源").Hidden();
        columns.Bound(o => o.UserName).Width(200).Title("添加用户名").ReadOnly().Hidden();
        columns.Bound(o => o.IpAddress).Width(200).Title("添加IP").ReadOnly().Hidden();
        columns.Bound(o => o.AddTime).Width(200).Title("添加时间").Hidden();
        columns.Bound(o => o.State).Width(200).Title("状态").Hidden();
        columns.Bound(o => o.UserId).Width(200).Title("添加用户Id").Hidden();
        columns.Bound(o => o.SortNum).Width(200).Title("排序号").Hidden();
        columns.Bound(o => o.DeleteTime).Width(200).Title("删除时间").Hidden();
        columns.Bound(o => o.IsAud).Width(200).Title("是否审核").Hidden();
        columns.Bound(o => o.IsDelete).Width(200).Title("是否删除").Hidden();
        columns.Bound(o => o.IsTop).Width(200).Title("是否顶置").Hidden();
        columns.Bound(o => o.IsVouch).Width(200).Title("是否推荐").Hidden();
        columns.Bound(o => o.TopTime).Width(200).Title("顶置时间").Hidden();
        columns.Bound(o => o.ViewCount).Width(200).Title("浏览量").Hidden();
        columns.Bound(o => o.VouchTime).Width(200).Title("推荐时间").Hidden();
        columns.Bound(o => o.AudTime).Width(200).Title("审核时间").Hidden();

        columns.Template(@<text><a  href = 'javascript:;'  class = 'addArticlePic t-button' rel = '@(item.Id)' >配图</a>
    </text>)
        .ClientTemplate("<a  href = 'javascript:;'  class = 'addArticlePic t-button' rel = '<#=Id #>' >配图</a> ")
        .Width(80).Title("配置图片").Hidden(!Html.HasUiPermission("Pic", "uploadarticle"));

        columns.Template(@<text><a  href = 'javascript:;'  class = 'preArticlePic t-button' rel = '@(item.Id)' >浏览配图</a>
    </text>)
        .ClientTemplate("<a  href = 'javascript:;'  class = 'preArticlePic t-button' rel = '<#=Id #>' >浏览配图</a> ")
        .Width(80).Title("浏览图片").Hidden(!Html.HasUiPermission(this.ViewContext, "articlepicview"));

        columns.Command(comm =>
        {
            comm.Delete().ButtonType(GridButtonType.Text);
        })
        .Width(100)
        .Title("编辑/删除");
    })
    .ClientEvents(clientEvents => clientEvents.OnDataBinding("dataBinding")
        .OnDataBound("bindAddArticlePic").OnComplete("bindComplete"))
    .DataKeys(key => key.Add("Id"))//添加主键
    .DataBinding(dataBinding => dataBinding.Ajax().Select("ajaxindex", "article")
        .Delete("delete", "article"))
    .Editable(editing => editing.Mode(GridEditMode.InLine))
    .Pageable(page => page.PageSize(15))
    .Render();
}
<script type="text/javascript">
    function searchChange() {
        $("#ArticleGrid").data("tGrid").rebind();
    }

    function dataBinding(args) {
        var searchKeyStr = $("#searchArticle").val();
        if (searchKeyStr == '标题') {
            searchKeyStr = '';
        }
        args.data = $.extend(args.data, { searchKey: searchKeyStr });
    }

    function mulDelete() {
        var delStr = $(':checked');
        if (delStr.length < 1) {
            alert('亲，您没有选择任何记录.');
            return;
        }
        jQuery.post('/article/muldelete', delStr, function (res) {
            if (res.success) {
                setTimeout(function () {
                    $("#ArticleGrid").data("tGrid").rebind();
                    $("#checkAllRecords").attr("checked", false);
                }, 1000);
            } else {
                alert(res.message);
            }
        });
    }

    function bindAddArticlePic() {
        $('.addArticlePic').bind('click', function (e) {
            var targetId = $(this).attr('rel');
            $('#uploadFormArticle #articleId').val(targetId);
            e.preventDefault();
            $('#ArticleAddPicWindow').data('tWindow').center().open();
        });

        $('.preArticlePic').bind('click', function (e) {
            var targetId = $(this).attr('rel');
            $.getJSON('/article/articlepicview/' + targetId, function (res) {
                if (res.success) {
                    var oImg = new Image();
                    oImg.onload = function () {
                        var width = oImg.width;
                        var height = oImg.height;
                        $('#divArticlePicPreView').width(width).height(height);
                        $('#divArticlePicPreView').parent().width(width).height(height);
                        $('#ArticlePicPreViewWindow').width(width + 20).height(height + 40);
                        e.preventDefault();
                        $('#divArticlePicPreView').html('<img src="' + res.path + '"/>');
                        $('#ArticlePicPreViewWindow').data('tWindow').center().open();
                    }
                    oImg.src = res.path;
                } else {
                    alert(res.message);
                }
            });
        });
    }

    function bindComplete() {
        $("#ArticleGrid input:checkbox[name='selectRow']").attr("checked", false);
    }

    $(function () {
        $("#ArticleGrid input:checkbox[name='selectRow']").attr("checked", false);
        bindAddArticlePic();

        $('#addArticle').bind('click', function (e) {
            e.preventDefault();
            $('#ArticleAddWindow').data('tWindow').center().open();
        });

        $('#checkAllRecords').click(function checkAll() { $("#ArticleGrid tbody input:checkbox[name='selectRow']").attr("checked", this.checked); });
        $(":input[data-autocomplete]").each(function () {
            $(this).autocomplete({
                source: $(this).attr("data-autocomplete")
            });
        });

        $("#searchArticle").focus(function () {
            if (this.value == "标题") {
                $("#searchArticle").val("");
            }
        }).blur(function () {
            if (this.value == "") {
                $("#searchArticle").val("标题");
            }
        });
    });
</script>
